import Vue from 'vue'
import 'normalize.css/normalize.css'

import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'

import ViewUI from 'view-design'
import './styles/iview.less'

import '@/styles/index.scss' // global css

import App from './App'
import store from './store'
import router from './router'
import * as filters from './filters'

import '@/icons' // icon
import '@/permission' // permission control
import request from '@/utils/request'
import {
  setLoc,
  getLoc,
  removeLoc
} from '@/utils/'
import * as prototype  from '@/utils/prototype'
import VueClipboard from 'vue-clipboard2'
Vue.use(VueClipboard)
// import ElInputValidate from 'el-input-validate'
// ElInputValidate(Vue)

/**
 * If you don't want to use mock-server
 * you want to use MockJs for mock api
 * you can execute: mockXHR()
 *
 * Currently MockJs will be used in the production environment,
 * please remove it before going online ! ! !
 */
// if (process.env.NODE_ENV !== 'production') {
//   const { mockXHR } = require('../mock')
//   mockXHR()
// }

Vue.use(ElementUI)

// 全局注册 组件6// const registerComponents = {
//   install: (c) => {
//     Vue.component('noPerpare',()=>())
//   }
// }
// Vue.use(registerComponents)
// 注册一个全局自定义指令 v-focus
Vue.directive('noData', {
  // 当绑定元素插入到 DOM 中。
  inserted: function (el,val,data) {
    // 聚焦元素
    el.style.cssText = 'display:block;text-align:center;height:100%;transform: translateY(25%)'
    el.innerHTML ='<div class="el-icon-picture-outline" style="font-size:50px" ></div><div>'+(val.value || '暂无数据')+'</div>'
  }
})

 Vue.prototype.getFileCate=(filePath)=>{
        let ext = '';
        let index
        if(filePath){
          index= filePath.lastIndexOf(".");
          //获取后缀
          ext = filePath.substr(index+1);
        }
        return ext
      }
// 创建根实例
Vue.use(ViewUI, {
  transfer: true,
  size: 'large',
  capture: false,
  select: {
    arrow: 'md-arrow-dropdown',
    arrowSize: 20
  }
})


Vue.prototype.openLoading = (type, text) => {
  const loading = Vue.prototype.$loading()
  if (type) {
    Vue.prototype.$loading({
      lock: true,
      text: text || 'Loading',
      spinner: 'el-icon-loading',
      background: 'rgba(0, 0, 0, 0.1)'
    })
    setTimeout(function () {
      loading.close()
    }, 10000)
  } else {
    setTimeout(() => {
      loading.close()
    }, 500)
  }
}
Vue.prototype.$ajax = request
Vue.prototype.setLoc = setLoc
Vue.prototype.getLoc = getLoc
Vue.prototype.removeLoc = removeLoc

Vue.prototype.turnBackPrev = () => {
  window.history.go(-1)
}
Object.keys(prototype).forEach(keyName=>{
  Vue.prototype[keyName] = prototype[keyName]
})

Vue.prototype.isArr = (arr) => {
  let isFalg
  if (arr) {
    if (arr.length >= 0) {
      isFalg = true
    }
  }
  return isFalg
}

Vue.prototype.markColor = (type) => {
  const types = {
    breakfast: '#F6AB2F',
    lunch: '#E6492D',
    dinner: '#6758F3'
  }
  return {
    backgroundColor: types[type],
    color: '#fff',
    width: '16px',
    height: '16px',
    display: 'inline-block',
    fontSize: '12px',
    lineHeight: '16px',
    textAlign: 'center',
    marginRight: '6px',
    verticalAlign: 'middle'
  }
}

Vue.config.productionTip = false
Object.keys(filters).forEach(key => {
  Vue.filter(key, filters[key])
})

new Vue({
  el: '#app',
  router,
  store,
  render: h => h(App)
})
